<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>查询</title>
    <script src="../../js/header.js"></script>
    <style type="text/css">
        html, body, #query {
            padding: 0px;
            margin: 0px;
        }
        #query{
            border-top: 3px solid #0D9AFF;
            padding: 25px;
        }
        .tab-title{
            font-size: 16px;
            font-weight: bold;
            border-left: 4px solid #0D9AFF;
            font-family: PingFangSC-Medium;
            padding-left:10px;
            margin-bottom: 20px;
        }
        .el-dialog__footer {
            padding: 10px 20px 20px;
            text-align: center;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
        }
        .el-dialog__body {
            color: rgb(96, 98, 102);
            font-size: 14px;
            word-break: break-all;
            padding: 0px 20px;
        }
        .el-tooltip__popper{
         	max-width:60%;
     	}
        #excel {
            display: none;
        }
        .el-input__inner {
            -webkit-appearance: none;
            background-color: #FFF;
            background-image: none;
            border-radius: 4px;
            border: 1px solid #DCDFE6;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
            color: #606266;
            display: inline-block;
            font-size: inherit;
            height: 30px;
            line-height: 30px;
            outline: 0;
            padding: 0 15px;
            -webkit-transition: border-color .2s cubic-bezier(.645,.045,.355,1);
            transition: border-color .2s cubic-bezier(.645,.045,.355,1);
        }
        .el-select,.el-input-number.el-select ,.el-date-editor.el-input, .el-date-editor.el-input__inner {
			width: 100%;
		}
        .listed .el-form-item__label{
            letter-spacing: 3px;
        }
        .el-textarea {
            width: 100%;
        }

        /* 搜索按钮样式修改 */
        #query .el-button.is-circle.search_btn{
            position: absolute;
            right: 0;
            top: 0;
            border: 0;
            background: none;
        }
        #query .el-button.is-circle.search_btn i{
            font-size: 17px;
        }

        .companycredit_gonggao .el-form-item__content{
            margin-left: 0!important;
        }
        #query .companycredit_publicstate .el-select{
            width: auto;
        }

        /* 拟制公告---封装样式 */
        .content_tab{
            padding: 20px 0;
        }
        .border_btm{
            border-bottom: 1px solid #ddd;
        }
        .border_left{
            border-left: 1px solid #ddd;
        }
    </style>
</head>
<body>
<div v-cloak id="query">
    <div style="margin-top: 10px;">
        <div style="margin-top: 10px;border-bottom:1px solid rgba(200,200,200,0.43);">
            <el-form :model="selectForm" :rules="rules" ref="selectForm" label-width="150px">
                <el-row>
                    <el-col :span="6">
                        <el-form-item label="标题:" prop="" label-width="110px">
                            <el-input v-model="selectForm.title" placeholder="" :disabled="selectFormDisabled"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col span="6">
                        <el-form-item label="创建人:" prop="" label-width="110px">
                            <el-input v-model="selectForm.createUser" placeholder="" :disabled="selectFormDisabled"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col span="6">
                        <el-form-item label="创建人单位:" prop="" label-width="110px">
                            <el-select v-model="selectForm.createUserUnit" placeholder="请选择创建人单位" :disabled="selectFormDisabled">
                                <el-option
                                        v-for="item in orgData"
                                        :key="item.appId"
                                        :label="item.dictName"
                                        :value="item.dictName">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="6">
                        <el-form-item label="状态:" prop="" label-width="110px">
                            <el-select v-model="selectForm.status" placeholder="请选择" :disabled="selectFormDisabled">
                                <el-option label="未发布" value="0"></el-option>
                                <el-option label="已发布" value="1"></el-option>
                                <el-option label="已撤销" value="2"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="10">
                        <el-form-item label="发布时间:" prop="" label-width="110px">
                            <el-date-picker
                                    v-model="selectForm.startTime"
                                    type="date"
                                    value-format="yyyy-MM-dd"
                                    placeholder="开始时间"
                                    style="width: 137px;"
                                    :disabled="selectFormDisabled">
                            </el-date-picker>
                            <span style="color: rgb(192, 204, 218);text-align: center;">—</span>
                            <el-date-picker
                                    v-model="selectForm.endTime"
                                    type="date"
                                    value-format="yyyy-MM-dd"
                                    placeholder="结束时间"
                                    style="width: 137px;"
                                    :disabled="selectFormDisabled">
                            </el-date-picker>
                        </el-form-item>
                    </el-col>
                    <div style="float: right;">
                        <el-button type="primary" size="small" style="width: 60px;height: 30px;" @click="searchForm('selectForm')">查询</el-button>
                        <el-button type="warning" size="small" style="width: 60px;height: 30px;" @click="resetForm('selectForm')">重置</el-button>
                    </div>
                </el-row>
            </el-form>
        </div>
    </div>
    <!--展示列表-->
    <el-table :data="tableData" border style="width: 100%;margin-top: 35px;" :header-cell-style="{background:'#eef1f6',color:'#606266'}">
        <el-table-column type="selection" ></el-table-column>
        <el-table-column
                prop=""
                type="index"
                label="序号"
                width="50"
                align="center" >
        </el-table-column>
        <el-table-column
                prop="createUser"
                label="创建人"
                width="100"
                align="center">
        </el-table-column>
        <el-table-column
                prop="createUserUnit"
                label="创建人单位"
                width="120"
                align="center">
        </el-table-column>
        <el-table-column
                prop="createTime"
                label="创建时间"
                width="110"
                align="center">
        </el-table-column>
        <el-table-column
                prop="releaseTime"
                label="发布时间"
                width="110"
                align="center">
        </el-table-column>
        <el-table-column
                prop="isPublic"
                label="公布类别"
                width="100"
                align="center">
            <template slot-scope="scope">
                <span v-if="scope.row.isPublic==0">公示通报</span>
                <span v-if="scope.row.isPublic==1">标准规范</span>
            </template>
        </el-table-column>
        <el-table-column
                prop="status"
                label="状态"
                width="90"
                align="center">
            <template slot-scope="scope">
                <span v-if="scope.row.status==0">未发布</span>
                <span v-if="scope.row.status==1">已发布</span>
                <span v-if="scope.row.status==2">已撤销</span>
            </template>
        </el-table-column>
        <el-table-column
                show-overflow-tooltip
                prop="title"
                label="标题"
                width="200"
                align="center">
        </el-table-column>
        <el-table-column
                show-overflow-tooltip
                prop="publicityContent"
                label="公示通报内容"
                width="210"
                align="center">
        </el-table-column>
        <el-table-column
                prop="isPublic"
                label="公布类别"
                width="100"
                align="center">
            <template scope="scope">
                <span v-if="scope.row.isPublic==0">公示通报</span>
                <span v-if="scope.row.isPublic==1">标准规范</span>
            </template>
        </el-table-column>
        <el-table-column
                label="操作"
                width=""
                align="center">
            <template slot-scope="scope">
            	<el-button size="mini" @click="view(scope.$index,scope.row)">查看详情</el-button>
                <el-button v-show="scope.row.status!='1'?true:false" type="primary" size="mini" @click="updView(scope.$index,scope.row)">修改</el-button>
                <el-button v-show="scope.row.status!='1'?true:false" type="danger" size="mini" @click="del(scope.$index,scope.row)">删除</el-button>
                <el-button v-show="scope.row.status!='1'?true:false" type="success" size="mini" @click="pub(scope.$index,scope.row)">发布</el-button>
                <el-button v-show="scope.row.status=='1'?true:false" type="warning" size="mini" @click="rev(scope.$index,scope.row)">撤回</el-button>               
            </template>
        </el-table-column>
    </el-table>
    <div style="overflow: hidden;">
        <div class="pagination">
            <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="currentPage"
                    :page-sizes="[10, 20, 30, 40]"
                    :page-size="pagesize"
                    background
                    layout="total, sizes,prev, pager, next"
                    :total="tableTotal"
                    prev-text="上一页"
                    next-text="下一页">
            </el-pagination>
        </div>
    </div>

    <el-dialog title="" :visible.sync="dialogView" center fullscreen>
        <el-form :model="addForm" :rules="rules" ref="addForm" label-width="150px">
        	<el-row>
				<el-col :span="4" class="tab-title">
					公示通报信息
				</el-col>
			</el-row>
            <el-row>
                <el-col span="9">
                    <el-form-item label="创建人:" prop="createUser" label-width="130px">
                        <el-input v-model="addForm.createUser " placeholder="" disabled></el-input>
                    </el-form-item>
                </el-col>
                <el-col span="9">
                    <el-form-item label="创建人单位:" prop="createUserUnit" label-width="190px">
                        <el-input v-model="addForm.createUserUnit" placeholder="" disabled></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="9">
                    <el-form-item label="创建时间:" prop="createTime" label-width="130px">
                        <el-date-picker
                                v-model="addForm.createTime"
                                type="date"
                                value-format="yyyy-MM-dd"
                                placeholder="创建时间"
                                disabled>
                        </el-date-picker>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="14">
                    <el-form-item label="公布类别:" prop="isPublic" label-width="120px">
                        <el-radio-group v-model="addForm.isPublic" :disabled="addFormDisabled">
                            <el-radio label="0">公示通报</el-radio>
                            <el-radio label="1">标准规范</el-radio>
                        </el-radio-group>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="14">
                    <el-form-item label="公开地址类型:" prop="publicType" label-width="120px">
                        <el-radio-group v-model="addForm.publicType" :disabled="addFormDisabled">
                            <el-radio label="0">服务门户</el-radio>
                            <el-radio label="1" >工作门户</el-radio>
                            <el-radio label="2" >服务门户和工作门户</el-radio>
                        </el-radio-group>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col span="22">
                    <el-form-item label="标题:" prop="title" label-width="130px">
                        <el-input v-model.trim="addForm.title" placeholder="" maxlength="500" show-word-limit clearable  :disabled="addFormDisabled"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="22">
                    <el-form-item label="内容:" prop="publicityContent" label-width="130px">
                        <el-input
                                maxlength="500"
                                show-word-limit clearable
                                type="textarea"
                                :autosize="{ minRows: 8, maxRows: 8}"
                                placeholder="请输入内容"
                                v-model.trim="addForm.publicityContent"
                                :disabled="addFormDisabled">
                        </el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="22">
                    <el-form-item label="附件:" label-width="130px">
                        <iframe width="100%" scrolling="no" style="height: 270px;border: none;"   :src="link"></iframe>
                    </el-form-item>
                </el-col>
            </el-row>
            <div  v-show="viewOrEdit">
                <el-row>
                    <el-col :span="22">
                        <div style="float:right;">
                            <el-button v-show="upd" type="primary" size="small" style="width: 60px;height: 30px;" @click="submitForm()">提交</el-button>
                            <el-button v-show="public" type="success" size="small" style="width: 60px;height: 30px;" @click="pubSub()">发布</el-button>
                            <el-button v-show="revok" type="warning" size="small" style="width: 60px;height: 30px;" @click="recall()">撤回</el-button>
                            <el-button type="info" size="small" style="width: 60px;height: 30px;" @click="dialogView = false;">取消</el-button>
                        </div>
                    </el-col>
                </el-row>
            </div>
        </el-form>
    </el-dialog>
</div>
<script>
    var vm = new Vue({
        el: '#query',
        data(){
            return{
                currentPage: 1,
                pagesize: 10,
                tableTotal:'',
                tableData: [],
                orgData:[],
                selectFormDisabled:false,
                selectForm: {
                    id:'',
                    title:'',
                    createUser:'',
                    createUserUnit:'',
                    status:'',
                    startTime:'',
                    endTime:'',

                },
                Form: {
                    id:'',
                    title:'',
                    createUser:'',
                    createUserUnit:'',
                    status:'',
                    startTime:'',
                    endTime:'',

                },
                dialogView:false,
                uuid:'',
                link:'',//iframe链接
                addForm: {
                    id:'',
                    createUser:'',
                    createUserUnit:'',
                    createTime:'',
                    title:'',
                    publicityContent:'',
                    publicType:'',
                    isPublic: ''
                },
                addFormDisabled:false,
                viewOrEdit:'',
                upd:false,
                public:false,
                revok:false,
                rules: {
                    createUser: [{
                        required: true,
                        message: "创建人必填",
                        trigger: "blur"
                    }],
                    createUserUnit: [{
                        required: true,
                        message: "创建人单位必填",
                        trigger: "blur"
                    }],
                    createTime: [{
                        required: true,
                        message: "创建时间必填",
                        trigger: "blur"
                    }],
                    title: [{
                        required: true,
                        message: "标题必填",
                        trigger: "blur"
                    },{
                        max : 500,
                        message : '长度最大为500个字符',
                        trigger : 'blur'
                    }],
                    publicityContent: [{
                        required: true,
                        message: "内容必填",
                        trigger: "blur"
                    },{
                        max : 500,
                        message : '长度最大为500个字符',
                        trigger : 'blur'
                    }],
                    publicType: [{
                        required: true,
                        message: "公开地址类型必填",
                        trigger: "blur"
                    }],
                    isPublic: [{
                        required: true,
                        message: "公布类别必填",
                        trigger: 'blur'
                    }]
                }
            }
        },
        created(){
            axios.post('/dzjwgr/dict/getdict/d_org').then(res => {
                this.orgData = res.data.data.result;
            }).catch(e => {
                this.$message.error("网络连接超时");
            })
        },
        mounted(){
            this.getData();
        },
        methods: {
            getData() {
                var pagesize = this.pagesize;
                var pageno = this.currentPage;
                axios({
                    method: 'get',
                    url: '/dzjwgr/publicity/publicityList',
                    params: {
                    	createUser: this.Form.createUser,
                        title: this.Form.title,
                        createUserUnit: this.Form.createUserUnit,
                        status: this.Form.status,
                        releaseStartTime: this.Form.startTime,
                        releaseEndTime: this.Form.endTime,
                        pageNo: pageno,
                        pageSize: pagesize
                    }
                })
                    .then(response => {
                    let data = response.data;
                if (data.code == 200) {
                    let dataInformation = response.data.data.results;
                    this.tableTotal = response.data.data.total;// 数据长度
                    this.tableData = dataInformation;
                } else {
                    this.$message.error(data.msg);
                }
            })
            .catch(function (error) {
                    console.log(error);
                });
            },
            /* 列表页搜索 */
            searchForm(selectForm) {
                var pagesize = this.pagesize;
                var pageno = 1;
                this.currentPage=1;
                var start=this.selectForm.startTime;
                var end=this.selectForm.endTime;
                var count=this.checkDate(end,start);
                if(count<0){
                    this.$message.error("开始时间不能大于结束时间")
                }else {
                    this.Form=  JSON.parse(JSON.stringify(this.selectForm));
                    axios({
                        method: 'get',
                        url: '/dzjwgr/publicity/publicityList',
                        params: {
                            createUser: this.Form.createUser,
                            title: this.Form.title,
                            createUserUnit: this.Form.createUserUnit,
                            status: this.Form.status,
                            releaseStartTime: this.Form.startTime,
                            releaseEndTime: this.Form.endTime,
                            pageSize: pagesize,
                            pageNo: pageno,
                        }
                    })
                        .then(response => {
                            let data = response.data;
                            if (data.code == 200) {
                                let dataInformation = response.data.data.results;
                                this.tableTotal = response.data.data.total;// 数据长度

                                this.tableData = dataInformation;
                            } else {
                                this.$message.error(data.msg);
                            }
                        })
                        .catch(function (error) {
                            console.log(error);
                        });
                }
            },
            /* 列表页重置 */
            resetForm(formName) {
                this.selectForm.title = '';
                this.selectForm.createUser = '';
                this.selectForm.createUserUnit = '';
                this.selectForm.status = '';
                this.selectForm.startTime = '';
                this.selectForm.endTime = '';
                this.Form.title = '';
                this.Form.createUser = '';
                this.Form.createUserUnit = '';
                this.Form.status = '';
                this.Form.startTime = '';
                this.Form.endTime = '';
                this.currentPage=1;
                this.getData();
            },
            //每页下拉显示数据
            handleSizeChange(size) {
                this.pagesize = size;
                this.getData();
            },
            //点击第几页
            handleCurrentChange(currentPage) {
                this.currentPage = currentPage;
                this.getData();
            },
            //查看
            view(index,row){
                this.dialogView=true;
                this.addFormDisabled=true;
                this.uuid=row.id;
                this.link="../upload/annex.html?uuid="+this.uuid+"&flag=0";
                this.viewOrEdit=true;
                axios({
                    method: 'get',
                    url: '/dzjwgr/publicity/info',
                    params: {
                        id: row.id
                    }
                })
                .then(response => {
                    let data = response.data;
                    if (data.code == 200) {
                        let rowdata = response.data.data;
                        this.addForm = rowdata;
                    } else {
                        this.$message.error(data.msg);
                    }
                })
                .catch(function (error) {
                    console.log(error);
                });
            },
            //修改
            updView(index,row) {
                this.dialogView = true;
                this.addFormDisabled = false;
                this.viewOrEdit = true;
                this.upd = true;
                this.public = false;
                this.revok = false;
                this.uuid = row.id;
                this.link = "../upload/annex.html?uuid=" + this.uuid + "&flag=1";
                axios({
                    method: 'get',
                    url: '/dzjwgr/publicity/info',
                    params: {
                        id: row.id
                    }
                })
                    .then(response => {
                    let data = response.data;
                if (data.code == 200) {
                    let rowdata = response.data.data;
                    this.addForm = rowdata;
                } else {
                    this.$message.error(data.msg);
                }
            })
                .catch(function (error) {
                    console.log(error);
                });
            },
            //修改提交
            submitForm(){
                this.$refs.addForm.validate(valid => {
                    if (valid) {
                        axios({
                            method: 'post',
                            url: '/dzjwgr/publicity/update',
                            data: this.addForm
                        })
                            .then(response => {
                                let data = response.data;
                                if (data.code == 200) {
                                    this.$message({
                                        message: '修改成功',
                                        type: 'success'
                                    });
                                    this.dialogView = false;
                                    this.getData();
                                } else {
                                    this.$message.error(data.msg);
                                }
                            })
                            .catch(function (error) {
                                console.log(error);
                            });
                    }else {
                        console.log("error!!");
                        return false;
                    }
                });
            },
            //删除
            del(index,row){
                var pagesize = this.pagesize;
                var pageno = this.currentPage;
                var afterPage = Math.floor(this.tableTotal / pagesize);
                var nowSize = this.tableTotal % pagesize;
            	this.$confirm('确定要删除吗?', '提示', {
                    cancelButtonText: '取消',
                    confirmButtonText: '确定',
                    type: 'warning'
                }).then(() => {
	                axios({
	                    method:'post',
	                    url:'/dzjwgr/publicity/delete',
	                    params: {
	                        id: row.id
	                    }
	                })
	                .then(response => {
	                    let data = response.data;
	                    if (data.code == 200) {
	                        this.$message({
	                            message: '删除成功',
	                            type: 'success'
	                        });
                            if(nowSize =='1'){
                                if(afterPage=='0'){
                                    this.currentPage = 1;
                                }else if(this.currentPage>afterPage){
                                    this.currentPage = afterPage;
                                }
                                this.getData();
                            }else {
                                this.getData();
                            }
	                       }
                        else {
	                        this.$message.error(data.msg);
	                    }
	                })
	                .catch(function (error) {
	                    console.log(error);
	                });
	            })
                    .catch(() => {
                    this.$message({
	                    type: 'info',
	                    message: '取消删除'
	                });
            	});
            },
            //发布
            pub(index,row){
                this.dialogView=true;
                this.addFormDisabled=true;
                this.viewOrEdit=true;
                this.upd=false;
                this.public=true;
                this.revok=false;
                this.uuid=row.id;
                this.link="../upload/annex.html?uuid="+this.uuid+"&flag=0";
                axios({
                    method: 'get',
                    url: '/dzjwgr/publicity/info',
                    params: {
                        id: row.id
                    }
                })
                    .then(response => {
                        let data = response.data;
                        if (data.code == 200) {
                            let rowdata = response.data.data;
                            this.addForm = rowdata;
                        } else {
                            this.$message.error(data.msg);
                        }
                    })
                    .catch(function (error) {
                        console.log(error);
                    });

            },
            //发布提交
            pubSub(){
                axios({
                    method: 'post',
                    url: '/dzjwgr/publicity/release',
                    data:this.addForm
                })
                    .then(response => {
                        let data = response.data;
                        if (data.code == 200) {
                            this.$message({
                                message: '发布成功',
                                type: 'success'
                            });
                            this.dialogView=false;
                            this.getData();
                        } else {
                            this.$message.error(data.msg);
                        }
                    })
                    .catch(function (error) {
                        console.log(error);
                    });
            },
            //撤回
            rev(index,row){
                this.dialogView=true;
                this.addFormDisabled=true;
                this.viewOrEdit=true;
                this.upd=false;
                this.public=false;
                this.revok=true;
                this.uuid=row.id;
                this.link="../upload/annex.html?uuid="+this.uuid+"&flag=0";
                axios({
                    method: 'get',
                    url: '/dzjwgr/publicity/info',
                    params: {
                        id: row.id
                    }
                })
                    .then(response => {
                        let data = response.data;
                        if (data.code == 200) {
                            let rowdata = response.data.data;
                            this.addForm = rowdata;
                        } else {
                            this.$message.error(data.msg);
                        }
                    })
                    .catch(function (error) {
                        console.log(error);
                    });

            },
            //撤回提交
            recall(){
                axios({
                    method: 'post',
                    url: '/dzjwgr/publicity/recall',
                    data: this.addForm
                })
                    .then(response => {
                        let data = response.data;
                        if (data.code == 200) {
                            this.$message({
                                message: '撤回成功',
                                type: 'success'
                            });
                            this.dialogView=false;
                            this.getData();
                        } else {
                            this.$message.error(data.msg);
                        }
                    })
                    .catch(function (error) {
                        console.log(error);
                    });
            },
            checkDate(str1, str2){
                if(str1!=null && str2!=null ){
                    var reg = /[^\d]+/;
                    var arr1 = str1.split(reg);
                    var arr2 = str2.split(reg);
                    var d1 = new Date(arr1[0],arr1[1],arr1[2]);
                    var d2 = new Date(arr2[0],arr2[1],arr2[2]);
                    return d1 - d2;
                }

            }
        }
    })
</script>
</body>
</html>